<template>
	<view class="">
		<u-navbar title="消息列表" :titleStyle="{ color: '#FFF', fontSize: '36rpx' }"
			:background="{backgroundColor:'#E62131'}" :is-back="false" :autoBack="true" title-color="#ffffff"
			:placeholder="true">
			<view class="u-nav-slot" slot="right" style="padding-right: 30rpx;color: #ffffff;" @click="allmeasg(-1)">
				全部已读</view>
		</u-navbar>

		<view class="centers">
			<view class="mesgList" v-for="(item,index) in tabList" :key="index" @click="listAdtops(item)">
				<view class="toptitle">
					<span>学员请假申请</span> <span class="weidu">{{item.isRead?'已读':'未读'}}</span>
				</view>
				<view class="tishi">
					{{item.studentAsk.studentInfo.name}}提交了请假申请，请及时审批
				</view>
				<view class="dates huise">
					{{item.createDate}}
				</view>
				<view class="kechengs huise">
					课程时间：{{item.studentAsk.workOut.classYear}}-{{item.studentAsk.workOut.classDate}}
					({{item.studentAsk.workOut.classStartTime}}~{{item.studentAsk.workOut.classEndTime}})
				</view>
				<view class="btns huise">
					课程名称：{{item.studentAsk.workOut.courseName}})
				</view>
				<view class="detas">
					详情
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	// import nanvBar from "@/components/nanvBar.vue"
	export default {
		// components: {
		// 	nanvBar
		// },
		data() {
			return {
				tabList: [],
				parms: {
					limit: 15,
					page: 1,
				}
			}
		},
		onLoad(options) {

		},
		onShareAppMessage(res) {
			return {
				title: '',
				path: "/pages/index/index"
			}
		},
		onShow() {
			this.sherList()
		},
		onReachBottom() {
			this.parms.page += 1
			this.studentinfolistappApi()
		},
		methods: {
			allmeasg(index) {
				uni.$api.common.msginfoeditRead({
					id: index,
				}).then((res) => {
					uni.showToast({
						title: '操作成功',
						icon: 'none',
						duration: 2000
					});
					this.studentinfolistappApi()
				});
			},
			// 去详情
			listAdtops(item) {
				uni.navigateTo({
					url: "../index/studentLeaveDetail?id=" + item.askId
				})
				uni.$api.common.msginfoeditRead({
					id: item.id,
				}).then((res) => {

				});

			},
			// 列表
			sherList() {
				this.parms.page = 1;
				this.tabList = [];
				this.studentinfolistappApi();
			},
			studentinfolistappApi() {
				uni.$api.common.msginfoList(this.parms).then((res) => {
					if (res.count === this.tabList.length) {
						uni.showToast({
							title: '没有更多了',
							icon: 'none',
							duration: 2000
						});
					} else {
						res.result.forEach((item) => {
							this.tabList.push(item)
						})
					}

				});
			},
		}
	}
</script>

<style lang="scss">
	.centers {
		padding: 30rpx;

		.mesgList {
			padding: 30rpx;
			border-radius: 10rpx;
			box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.3);
			margin-bottom: 26rpx;

			.toptitle {
				display: flex;
				align-items: center;
				justify-content: space-between;
				font-weight: bold;
				font-size: 28rpx;

				.weidu {
					color: #b1b1b1;
					font-size: 24rpx;
				}
			}

			.tishi {
				font-size: 28rpx;
				color: #010101;
				font-weight: bold;
				margin: 20rpx 0;
			}

			.huise {
				color: #b1b1b1;
				margin-bottom: 14rpx;
			}

			.detas {
				padding: 20rpx 0 0;
				border-top: 1rpx solid #e1e1e1;
			}
		}
	}

	.rightex {
		padding-right: 30rpx;
		text-align: right;
		color: #ffffff;
	}
</style>